<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>排行榜</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="My Play Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<link href="${pageContext.request.contextPath}/css/bootstrap.min.css" rel='stylesheet' type='text/css' media="all" />
<link href="${pageContext.request.contextPath}/css/dashboard.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/css/style.css" rel='stylesheet' type='text/css' media="all" />
<script src="${pageContext.request.contextPath}/js/jquery-1.11.1.min.js"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
</head>
  <body>

   <jsp:include page="header.jsp"></jsp:include>

    <jsp:include page="menu.jsp"></jsp:include>

        
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
			<div class="main-grids row">
				<div class="col-sm-4 rankList1">
					<p class="text-center">推荐排行榜</p>
					<ol class="commentlist">
						<c:forEach items="${clicks }" var="vclick">
							<li>
								<p><br /></p>
								<p><a href="${pageContext.request.contextPath}/video/to_play_video/${vclick.id}">${vclick.name }</a></p>
							</li>
						</c:forEach>
					</ol><!--commentlist end-->
				</div>
				<div class="col-sm-4 rankList2">
					<p class="text-center">用户积分排行榜</p>
					<ol class="commentlist">
						<c:forEach items="${users }" var="user">
							<li>
								<div>
									<img src="${pageContext.request.contextPath}/upload/head-icon/${user.picUrl}" class="img-circle media-image center-block">
								</div>
								<p class="text-center"><span>用户：${user.nickname }</span>&nbsp;&nbsp;<span>积分：${user.rankPoint }</span></p>
							</li>
						</c:forEach>
					</ol><!--commentlist end-->
				</div>
				<div class="col-sm-4 rankList3">
					<p class="text-center">点击量排行榜</p>
					<ol class="commentlist">
						<c:forEach items="${recomms }" var="rclick">
								<li>
									<p><br /></p>
								<p><a href="${pageContext.request.contextPath}/video/to_play_video/${rclick.id}">${rclick.name }</a></p>
								<p class="text-right">点击量：${rclick.videoClick }</p>
								</li>
						</c:forEach>
					</ol><!--commentlist end-->
					<div class="clearfix"></div>
				</div>

			</div>
			
<jsp:include page="footer.jsp"></jsp:include>

		</div>
    <script src="js/bootstrap.min.js"></script>
    <script>
   	$(document).ready(function(){
		$(".rankList1 .commentlist li").each(function (i) {
			i = i+1;
			$(this).prepend('<span class="commentnumber"> #'+i+'</span>');
  	 	});
		$(".rankList2 .commentlist li").each(function (i) {
			i = i+1;
			$(this).prepend('<span class="commentnumber"> #'+i+'</span>');
  	 	});
		$(".rankList3 .commentlist li").each(function (i) {
			i = i+1;
			$(this).prepend('<span class="commentnumber"> #'+i+'</span>');
  	 	});

	});
    </script>
  </body>
</html>